<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			/* 单行溢出 */
			.text1{
				width: 200px;
				text-overflow: ellipsis;
				white-space:nowrap;
				overflow: hidden;
			}
			/* 多行溢出 */
			.text2{
				display: -webkit-box;
				-webkit-box-orient: vertical;
				-webkit-line-clamp: 2;
				overflow:hidden;
				width: 200px;
				/* word-break: break-all; 
				text-overflow: ellipsis; */
			}
		</style>
	</head>
	<body>
		<!-- 单行文本省略号 -->
		<p class= "text1">
			庭院深深,不知有多深？杨柳依依,飞扬起片片烟雾
			，一重重帘幕不知有多少层。豪华的车马停在贵族公子寻欢作乐的地方，她登楼向远处望去，却看不见那通向章台的大路。春已至暮，三月的雨伴随着狂风大作，再是重门将黄昏景色掩蔽，也无法留住春意。泪眼汪汪问落花可知道我的心意，落花默默不语，纷乱的，零零落落一点一点飞到秋千外。
		</p>
		<!-- 多行文本省略号 -->
		<p class= "text2">
			庭院深深,不知有多深？杨柳依依,飞扬起片片烟雾，一重重帘幕不知有多少层。豪华的车马停在贵族公子寻欢作乐的地方，她登楼向远处望去，却看不见那通向章台的大路。春已至暮，三月的雨伴随着狂风大作，再是重门将黄昏景色掩蔽，也无法留住春意。泪眼汪汪问落花可知道我的心意，落花默默不语，纷乱的，零零落落一点一点飞到秋千外。
		</p>
	</body>
</html>